<template>
  <div class="reputationManagement">
    <el-card shadow="hover">
      <div class="searchBox">
        <el-input placeholder="请输入事件名称" v-model="eventName">
          <template slot="prepend">事件名称</template>
        </el-input>
        <el-button class="btn" @click="reputationListBtn">查询搜索</el-button>
      </div>
      <el-table :data="tableData" v-loading="loading" style="width: 100%">
        <el-table-column prop="eventName" label="事件名称"> </el-table-column>
        <el-table-column prop="rule" label="规则"> </el-table-column>
        <el-table-column prop="reputationValue" label="信誉值">
          <template slot-scope="scope">
            {{ scope.row.type == "inc" ? "+" : "-"
            }}{{ scope.row.reputationValue }}
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button size="mini" @click="handleEdit(scope.row)"
              >编辑</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <!-- <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="page"
        :limit.sync="pageSize"
        @pagination="getList"
      /> -->

      <!-- 编辑弹框 -->
      <el-dialog title="编辑事件" :visible.sync="dialogVisible" width="30%">
        <p>
          事件名称
          <el-input disabled placeholder="请输入事件名称" v-model="eventNameB">
          </el-input>
        </p>

        <p>
          信誉值加减<el-radio disabled v-model="radio" label="1">增加</el-radio
          ><el-radio disabled v-model="radio" label="2">减少</el-radio>
        </p>
        <p>
          数值
          <el-input
            placeholder="请输入数值"
            onkeyup="this.value=value.replace(/[^\d{1,}\.\d{1,}|\d{1,}]/g,'')"
            v-model="num"
          >
          </el-input>
        </p>

        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="editConfirmation">确 定</el-button>
        </span>
      </el-dialog>
    </el-card>
  </div>
</template>

<script>
import Pagination from "@/components/Pagination"; // 分页
import { reputationList, reputationEdit } from "@/api/operationManagement";
export default {
  components: { Pagination },
  inject: ["reload"],
  data() {
    return {
      loading: true,
      eventName: "", //搜索input
      tableData: [],
      eventNameB: "",
      radio: "1",
      num: "",
      dialogVisible: false,
      //   total: 0,
      //   page: 1, //页码
      //   pageSize: 10, //每页条数
      type: "",
    };
  },
  methods: {
    //列表
    reputationList() {
      this.loading = true;
      reputationList({
        // page: this.page,
        // pageSize: this.pageSize,
        eventName: "",
      }).then((res) => {
        if (res.code == 0) {
          this.tableData = res.data;
          this.loading = false;
        }
      });
    },
    ///搜索
    reputationListBtn() {
      this.loading = true;

      reputationList({
        // page: this.page,
        // pageSize: this.pageSize,
        eventName: this.eventName,
      }).then((res) => {
        if (res.code == 0) {
          this.tableData = res.data;
          this.loading = false;
        }
      });
    },
    //编辑
    handleEdit(row) {
      this.dialogVisible = true;
      if (row.type == "inc") {
        this.radio = "1";
      } else {
        this.radio = "2";
      }
      row.reputationValue = row.reputationValue + "";
      if (row.reputationValue.indexOf("-") != -1) {
        this.num = row.reputationValue.replace("-", "");
      } else {
        this.num = row.reputationValue;
      }
      this.eventNameB = row.eventName;
      this.id = row.id;
      this.type = row.type;
    },
    editConfirmation() {
      reputationEdit({
        id: this.id,
        eventName: this.eventNameB,
        // reputation: this.radio,
        type: this.radio == 1 ? "inc" : "dec",
        num: this.num,
      }).then((res) => {
        if (res.code == 0) {
          this.$message({
            message: "编辑成功",
            type: "success",
          });
          this.reload();
        }
      });
    },
    //分页
    getList() {
      this.loading = true;

      reputationList({
        // page: this.page,
        // pageSize: this.pageSize,
        eventName: this.eventName,
      }).then((res) => {
        if (res.code == 0) {
          this.tableData = res.data;
          this.loading = false;
        }
      });
    },
  },
  created() {
    this.reputationList();
  },
};
</script>

<style lang="less" scoped>
.reputationManagement {
  margin: 30px;
  height: 100%;
  .searchBox {
    display: flex;
    margin-bottom: 40px;
    .el-input {
      width: 300px;
      margin-right: 20px;
    }
  }
  .el-dialog {
    p {
      font-size: 16px;

      .el-radio {
        margin-left: 10px;
      }
      .el-input {
        margin-top: 10px;
      }
    }
  }
}
</style>